// Options menu
.options {
  @include group;
  @include user-select(none);
  @include position(absolute, 0px 0px none none);
  @include animation(reveal 1s);
  background: rgba(black, 0.13);
  padding: 3px;
  margin: -2px 0;
  border-radius: 4px;
  line-height: 1;
  font-size: 12px;

  li, menu {
    float: left;
  }

  > li {
    overflow: hidden;
    border-radius: 2px;
    margin-left: 3px;
    box-shadow: 0 0 0 1px rgba(black, .1);

    &:first-child {
      margin: 0;
    }
  }

  li:not(.p-group) {
    $-active-color: darken(#81c191, 10);

    background: white;
    cursor: pointer;
    padding: 5px 10px;

    &:hover {
      background: #f6f4e9;
    }

    &.active {
      background: $-active-color;
      text-shadow: 0 -1px 0 rgba(black, 0.3);
      box-shadow: inset 0 1px 1px rgba(black, .1);
      color: white;
    }

    &:active {
      background: darken($-active-color, 10);
      color: white;
    }
  }

  menu {
    background: rgba(black, .1);

    li:not(:first-child) {
      margin-left: 1px;
    }
  }
}


@include keyframes(reveal) {
  0% {
    opacity: 0
  }
  100% {
    opacity: 1
  }
}
